// 1. 引入 createSlice
import { createSlice } from "@reduxjs/toolkit";

// 2. 调用 createSlice，做好配置，返回 slice 对象
const todosSlice = createSlice({
  name: "todos",
  initialState: {
    raws: [{ id: 1, title: "吃饭", done: false }],
  },
  reducers: {
    addTodo(state) {
      // 由于 RTK 集成了 immer ，无需想着会不会修改到源数据了。
      state.raws.push({ id: 2, title: "睡觉", done: true });
    },
    // 删除一个todo
    delTodo(state, { payload }) {
      console.log("payload", payload);
      // payoload 是一个数组的下标
      state.raws.splice(payload, 1);
    },
  },
});

// 3. 导出相关的内容
//      1. 哪些动作创建函数。给到 组件中 dispatch 去使用的。（可选）
//      2. reducer 给到 configureStore 去使用了（必须）
// export const addTodo = todosSlice.actions.addTodo;
// export const delTodo = todosSlice.actions.delTodo;
export const { addTodo, delTodo } = todosSlice.actions;

export default todosSlice.reducer;
